/// Elegance控件库的图片控件
///
/// 简洁的图片组件，支持主题样式、加载状态、错误提示、圆角和形状等功能

import 'package:flutter/material.dart';

import '../../core/elegance_theme.dart';

/// 图片形状枚举
enum EImageShape {
  /// 方形
  square,

  /// 圆形
  circle,
}

/// 图片加载状态枚举
enum EImageStatus {
  /// 初始状态
  none,

  /// 加载中
  loading,

  /// 加载成功
  success,

  /// 加载失败
  error,
}

/// EImage控件
class EImage extends StatefulWidget {
  /// 创建EImage控件
  const EImage({
    super.key,
    required this.src,
    this.width,
    this.height,
    this.fit = BoxFit.cover,
    this.shape = EImageShape.square,
    this.radius = 0.0,
    this.fade = true,
    this.duration = 1000,
    this.bgColor,
    this.onTap,
    this.onError,
    this.onLoad,
    this.loadingSlot,
    this.errorSlot,
  });

  /// 图片地址
  final String src;

  /// 宽度
  final double? width;

  /// 高度
  final double? height;

  /// 裁剪模式
  final BoxFit fit;

  /// 图片形状
  final EImageShape shape;

  /// 圆角
  final double radius;

  /// 是否需要淡入效果
  final bool fade;

  /// 过渡时间，单位 ms
  final int duration;

  /// 背景颜色，默认为主题的backgroundColor
  final Color? bgColor;

  /// 点击图片时触发的回调
  final VoidCallback? onTap;

  /// 图片加载失败时触发的回调
  final Function? onError;

  /// 图片加载成功时触发的回调
  final VoidCallback? onLoad;

  /// 自定义加载中的提示内容
  final Widget? loadingSlot;

  /// 自定义失败的提示内容
  final Widget? errorSlot;

  @override
  EImageState createState() => EImageState();
}

class EImageState extends State<EImage> {
  /// 当前图片加载状态
  EImageStatus _status = EImageStatus.none;

  /// 当前透明度，用于淡入动画
  double _opacity = 0;

  @override
  void initState() {
    super.initState();

    // 如果不需要淡入效果，直接设置透明度为1
    if (!widget.fade) {
      _opacity = 1;
    }

    // 设置加载状态
    if (widget.src.isNotEmpty) {
      _status = EImageStatus.loading;
    }
  }

  @override
  void didUpdateWidget(covariant EImage oldWidget) {
    super.didUpdateWidget(oldWidget);

    // 如果图片地址发生变化，重新开始加载
    if (oldWidget.src != widget.src && widget.src.isNotEmpty) {
      setState(() {
        _status = EImageStatus.loading;
        if (widget.fade) {
          _opacity = 0;
        }
      });
    }
  }

  /// 处理图片加载成功
  void _handleImageLoad() {
    if (mounted) {
      WidgetsBinding.instance.addPostFrameCallback((_) {
        if (mounted) {
          setState(() {
            _status = EImageStatus.success;
            _opacity = 1;
          });

          // 触发加载成功回调
          widget.onLoad?.call();
        }
      });
    }
  }

  /// 处理图片加载错误
  void _handleImageError(dynamic error, StackTrace? stackTrace) {
    if (mounted) {
      WidgetsBinding.instance.addPostFrameCallback((_) {
        if (mounted) {
          setState(() {
            _status = EImageStatus.error;
          });

          // 触发加载错误回调
          widget.onError?.call(error);
        }
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    // 获取主题
    final theme = EleganceTheme.of(context);
    final bgColor = widget.bgColor ?? theme.backgroundColor;
    final errorColor = theme.errorColor;
    final primaryColor = theme.primaryColor;

    // 如果不显示，返回空容器
    if (widget.src.isEmpty) {
      return Container();
    }

    // 获取尺寸
    double width = widget.width ?? 300.0;
    double height = widget.height ?? 225.0;
    double radius = widget.radius;

    // 如果是圆形，忽略radius，使用宽高中较小的值的一半作为半径
    if (widget.shape == EImageShape.circle) {
      radius = width < height ? width / 2 : height / 2;
    }

    // 构建图片组件
    Widget imageWidget = AnimatedOpacity(
      opacity: _opacity,
      duration: Duration(milliseconds: widget.duration),
      child: Image.network(
        widget.src,
        fit: widget.fit,
        errorBuilder: (context, error, stackTrace) {
          _handleImageError(error, stackTrace);
          return Container();
        },
        frameBuilder: (context, child, frame, wasSynchronouslyLoaded) {
          // 无论是否同步加载，只要有frame就表示图片已加载成功
          if (frame != null) {
            _handleImageLoad();
          }
          return child;
        },
      ),
    );

    // 根据状态构建内容
    Widget content;
    if (_status == EImageStatus.loading || _status == EImageStatus.none) {
      // 加载中或初始状态
      content = Stack(
        children: [
          // 始终渲染图片
          imageWidget,
          // 显示加载中组件
          _shouldShowLoading()
              ? _buildLoadingWidget(primaryColor)
              : Container(),
        ],
      );
    } else if (_status == EImageStatus.error) {
      // 加载失败
      content = _shouldShowError()
          ? _buildErrorWidget(errorColor)
          : Container();
    } else {
      // 加载成功
      content = Stack(
        children: [
          // 始终渲染图片
          imageWidget,
          // Container(),
        ],
      );
    }

    // 构建容器
    Widget container = Container(
      width: width,
      height: height,
      decoration: BoxDecoration(
        color: bgColor,
        borderRadius: BorderRadius.all(Radius.circular(radius)),
      ),
      clipBehavior: Clip.antiAlias,
      child: content,
    );

    // 添加点击事件
    if (widget.onTap != null) {
      container = InkWell(onTap: widget.onTap, child: container);
    }

    return container;
  }

  // 构建加载中状态的组件
  // 检查是否需要显示加载状态
  bool _shouldShowLoading() {
    // 如果src为空，不显示加载状态
    if (widget.src.isEmpty) return false;
    // 默认返回true
    return true;
  }

  // 检查是否需要显示错误状态
  bool _shouldShowError() {
    // 如果src为空，不显示错误状态
    if (widget.src.isEmpty) return false;
    // 默认返回true
    return true;
  }

  // 构建加载中状态的组件
  Widget _buildLoadingWidget(Color primaryColor) {
    if (widget.loadingSlot != null) {
      return Center(child: widget.loadingSlot);
    }

    return Center(
      child: Icon(Icons.photo, size: 32, color: primaryColor.withOpacity(0.5)),
    );
  }

  // 构建加载失败状态的组件
  Widget _buildErrorWidget(Color errorColor) {
    if (widget.errorSlot != null) {
      return Center(child: widget.errorSlot);
    }

    return Center(
      child: Icon(
        Icons.error_outline,
        size: 32,
        color: errorColor.withOpacity(0.5),
      ),
    );
  }
}
